<template>
  <div class="app-container">
    <el-row :gutter="20">
      <leftPanel tree-type="question" @leftClick="getTreeNotes" />
      <el-col :span="20" :xs="24">
        <div class="paper-right">
          <div class="paper-views">
            <QuestionList
              ref="questionList"
              :repos-id="reposId"
              :knowledge-id="knowledgeId"
              :course-id="courseId"
              :tree-type="treeType"
              :auto-load="false"
            ></QuestionList>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import QuestionList from "./list.vue";
export default {
  components: { QuestionList },
  data() {
    return {
      reposId: null,
      knowledgeId: null,
      courseId: null,
      treeType: null,
    };
  },
  created() {},
  methods: {
    // 树节点单击事件
    getTreeNotes(obj) {
      console.log('getTreeNotes', obj)
      if (obj) {
        // this.reposId = String(obj.departMajor[3]);
        // this.courseId = String(obj.departMajor[3]);

        if(obj.treeNode.treeType === 'course') {
          this.courseId = obj.treeNode.id
        }
        this.knowledgeId = String(obj.treeNode.id);
        this.treeType = String(obj.treeNode.treeType);
        this.handleQuery();
      } else {
        this.reposId = null;
        this.knowledgeId = null;
        this.courseId = null;
        this.treeType = null;
      }
    },
    handleQuery() {
      this.$nextTick(() => {
        this.$refs.questionList.getList();
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.paper-detail {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 50px);
  background-color: #f4f4f8;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: stretch;

  .paper-left {
    flex-shrink: 0;
    // height: 100%;
    width: 300px;
    // margin-right: 20px;
  }
  .paper-right {
    height: 100%;
    width: 0;
    flex: 1;
    overflow-y: auto;
  }
}

.hasTagsView {
  .paper-detail {
    min-height: calc(100vh - 84px);
  }
}
</style>
